<ion-view >
	<header  class="bar bar-header  bar-stable bar-mycolor " >
			<h1 class="title">茶友</h1>
	</header>

  <ion-content class="has-header bk-gray" ng-init="init()">

	<div id="friends-nav" class="row font-color-gray">
		<div class="col" ng-click="show_friends_list_view()">
		  <div class="nav-circle" >
					<div class="nav-circle-icon"></div>
					<img src="img/friends/friends.png"/>
					<div class="nav-circle-label">我的茶友</div>
			</div>
		</div>

		<div class="col">
		  <div class="nav-circle" ng-click="goToGroupList()">
					<div class="nav-circle-icon"></div>
					<img src="img/friends/group.png"/>
					<div class="nav-circle-label">茶群</div>
			</div>
		</div>

		<div class="col">
		  <div class="nav-circle" ng-click="goToTeaFriendsRank()">
					<div class="nav-circle-icon"></div>
					<img src="img/friends/friends_rank.png"/>
					<div class="nav-circle-label">茶人榜</div>
			</div>
		</div>

		<div class="col">
			<div class="nav-circle" ng-click="goToTeaFriendsRecommend()">
					<div class="nav-circle-icon"></div>
					<img src="img/friends/rec_friends.png"/>
					<div class="nav-circle-label">茶友</div>
			</div>
		</div>
	</div>

	<div class="title-style-tip title-tip-red" id="product-title-tip">
  	 	<div class="title-hr"></div>
  		<span class="tip-title">我的茶群</span>
    </div>

  <div class="list">
    <a class="item item-avatar" ng-repeat="x in dataGroupList" ng-click="goToChatGroup(x.id, x.unread)">
      <!-- <img src={{x.latestMessage.extra.groupDetail.logo}}>
      <h2>{{x.latestMessage.extra.groupDetail.name}} <span class="group-list-time">{{x.receivedTime}}</span></h2>
      <p>{{x.latestMessage.text}}</p> -->
			<img src={{x.logo}}>
			<h2>{{x.name}}</h2>
			<p>{{x.isImage == true ? '[图片消息]' : x.latestMessage.text}}<span class="badge badge-assertive top_10px" ng-show="x.unread>0">{{x.unread}}</span></p>
    </a>
  </div>

  </ion-content>
</ion-view>
